<script setup lang="ts">
import { onMounted } from 'vue'
import { useAppStore } from './stores/app'

const appStore = useAppStore()

onMounted(() => {
  // 检查系统主题
  const darkModeMediaQuery = window.matchMedia('(prefers-color-scheme: dark)')
  appStore.setTheme(darkModeMediaQuery.matches ? 'dark' : 'light')

  // 监听系统主题变化
  darkModeMediaQuery.addEventListener('change', (e) => {
    appStore.setTheme(e.matches ? 'dark' : 'light')
  })
})
</script>

<template>
  <router-view></router-view>
</template>

<style>
@import './assets/main.css';

#app {
  min-height: 100vh;
}
</style>
